<template>
    <div class="table">
        <div class="crumbs">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item> 留言墙中心</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <div class="handle-box">
            <el-button type="primary" icon="delete" class="handle-del mr10" @click="delAll">批量删除</el-button>
            <el-select v-model="activityId" placeholder="筛选活动" class="handle-select mr10">
                <el-option label="全部活动" value="0"></el-option>
                <el-option v-for="(type_item,index) in typeCenter" :key="index" :label="type_item.a_type_name" :value="type_item.a_tid"></el-option>
            </el-select>
            <el-select v-model="orderBy" placeholder="排序方式" class="handle-select mr10">
                <el-option label="时间倒叙" value="TimeDesc"></el-option>
                <el-option label="时间升序" value="Time"></el-option>
                <el-option label="点赞数" value="LikeCount"></el-option>
                <el-option v-for="(type_item,index) in typeCenter" :key="index" :label="type_item.a_type_name" :value="type_item.a_tid"></el-option>
            </el-select>
            <!-- <el-input v-model="select_word" placeholder="筛选关键词" class="handle-input mr10"></el-input> -->
            <el-button type="primary" icon="search" @click="getData">搜索</el-button>
        </div>


        <div class="item-container">

            <ul>
                <li class="item-container-inline" v-for="item in ugcData">
                 <div class="item-list item-avatar">
                     <img :src="item.pic" class="item-avatar"/>
                 </div>
                 <div class="item-list">
                     <div  class="item-list-info">
                         <span>{{item.userNickName}}</span>
                         <span>{{item.creationTime|getTtime}}</span>
                         <span><i  class="iconfont icon-like iconred"></i>{{item.likeCount}}</span>
                     </div>
                     <div class="item-list-info">
                         <div class="item-list-detail">
                            <el-collapse>
                              <el-collapse-item :title="item.content" name="1">
                                <div>{{item.content}}</div>
                              </el-collapse-item>
                             <el-collapse-item title="系统备注：该用户已经被拉黑" name="2">
                                <div>该用户中奖</div>
                             </el-collapse-item>
                          </el-collapse>
                     </div>
                         <div class="item-list-detail item-list-btn">
                            <el-dropdown>
                                 <el-button type="default">
                                    拉黑<i class="el-icon-arrow-down el-icon--right"></i>
                                 </el-button>
                                 <el-dropdown-menu slot="dropdown">
                                     <el-dropdown-item>拉黑并删除</el-dropdown-item>
                                     <el-dropdown-item>拉黑不删除</el-dropdown-item>
                                </el-dropdown-menu>
                            </el-dropdown>
                            <el-button type="default"  @click="getData">中奖</el-button>
                            <el-button type="default"  @click="getData">编辑备注</el-button>
                         </div>
                     </div>
                 </div>
                </li>
            </ul>
        </div>

    </div>
</template>

<script>
import * as rpConfig from "../../../rpConfig/constant";
import { HttpReq } from "../../service/server";
var Server = new HttpReq();
export default {
  data() {
    return {
      ugcData: [],
      typeCenter: [],
      cur_page: 1,
      all_page: 1,
      activityId: "",
      orderBy: "",
      del_list: "",
      offset: 10,
      select_cate:'',
      is_search: false
    };
  },
  created() {
    this.getData();
    //this.getType();
  },
  computed: {},
  methods: {
    handleCurrentChange(val) {
      this.cur_page = val;
      this.getData();
    },
    getData() {
      let self = this;
      Server._REQUEST_JSON(
        rpConfig.API_URI + "/ugc/r/list",
        {
          lastUgcNo: self.cur_page==1?0:self.newsCenter[self.cur_page*self.offset-1].ugcNo,
          a_type_id: self.select_cate,
          offset:self.offset,
          orderBy:self.orderBy
        },
        function(res) {
          self.ugcData = res.data;
          //console.log( self.ugcData)
          self.all_page = Math.ceil(res.data.num / res.data.pagesize) * 10;
        },'get'
      );
    },
    getType() {
      let self = this;
      Server._POST(
        rpConfig.API_URI + "/activity/r/list",
        {},
        function(response) {
          self.typeCenter = response.data;
        }
      );
    },
    time_filter(row) {
      return row.a_publish_time.substring(0, 16);
    },
    publish_formatter(row) {
      return row.a_state == 1 ? "上线内容" : "草稿";
    },
    filterTag(value, row) {
      return row.tag === value;
    },
    handleEdit(row) {
      this.$router.push("/newsedit/" + row.a_id);
      //this.$message('编辑第' + (index + 1) + '行')
    },
    handleInTop(row) {
      let self = this;
      Server._POST(
        rpConfig.API_URI + "/newscenter.Index/setInTop",
        { item_id: row.a_id, a_top: row.a_top },
        function(response) {
          self.$message.success(response.msg);
          self.getData();
        }
      );
    },
    handleDelete(row) {
      let self = this;
      Server._POST(
        rpConfig.API_URI + "/newscenter.Index/deleteNewsItem",
        { item_id: [row.a_id] },
        function(response) {
          self.$message.success(response.msg);
          self.getData();
        }
      );
    },
    delAll() {
      const self = this,
        length = self.multipleSelection.length;
      let delArr = [];
      for (let i = 0; i < length; i++) {
        delArr.push(self.multipleSelection[i].a_id);
      }
      if (delArr.length == 0) {
        self.$message.info("请选择要删除的记录");
      } else {
        Server._POST(
          rpConfig.API_URI + "/newscenter.Index/deleteNewsItem",
          { item_id: delArr },
          function(response) {
            self.$message.success(response.msg);
            self.getData();
          }
        );
      }

      self.multipleSelection = [];
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
    }
  }
};
</script>

<style scoped>
/* 数据列表 */
@import url('../../../static/css/activity-list.css');
</style>